{% extends 'base.html' %}

{% block title %}
    {{ block.super }} | 台站列表
{% endblock %}

{% block content %}
    <div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pt-3 pb-2 mb-3 border-bottom">
        <h1 class="h2">台站列表 | <a href="{{ network.get_absolute_url }}">{{ network.code }}</a>台网 </h1>
        <div class="btn-toolbar mb-2 mb-md-0">
            <div class="btn-group mr-2">
                <button class="btn btn-sm btn-outline-secondary">Share</button>
                <button class="btn btn-sm btn-outline-secondary">Export</button>
            </div>
            <button class="btn btn-sm btn-outline-secondary dropdown-toggle">
                <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
                     stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
                     class="feather feather-calendar">
                    <rect x="3" y="4" width="18" height="18" rx="2" ry="2"></rect>
                    <line x1="16" y1="2" x2="16" y2="6"></line>
                    <line x1="8" y1="2" x2="8" y2="6"></line>
                    <line x1="3" y1="10" x2="21" y2="10"></line>
                </svg>
                This week
            </button>
        </div>
    </div>

    <nav aria-label="breadcrumb">
        <ol class="breadcrumb">
            <li class="breadcrumb-item"><a href="/">首页</a></li>
            <li class="breadcrumb-item active" aria-current="page">Library</li>
        </ol>
    </nav>

    <table class="table table-secondary">
        <thead>
        <tr>
            <th>序号</th>
            <th>台站代码</th>
            <th>台站名称(中文)</th>
            <th>台站名称(英文)</th>
            <th>台站经度</th>
            <th>台站纬度</th>
            <th>台站高程</th>
        </tr>
        </thead>
        <tbody>
        {% for station in station_list %}
            <tr>
                <th>{{ forloop.counter }}</th>
                <td><a href="{{ station.get_absolute_url }}">{{ station.code }}</a></td>
                <td>{{ station.name_zh }}</td>
                <td>{{ station.name_en }}</td>
                <td>{{ station.longitude }}</td>
                <td>{{ station.latitude }}</td>
                <td>{{ station.altitude }}</td>
            </tr>
            </tbody>
        {% endfor %}
    </table>
    <a class="btn btn-primary" href="{% url 'seisnet:station_add_with_network' network_code=network.code %}">新增台站</a>
{% endblock %}